<%--
XPTracker - Alternative Agile Tracking Tool
Copyright (C) 2006-2009  Stephen Starkey

This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License
as published by the Free Software Foundation; either version 2
of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA
--%>
<%@ include file="/taglibs.jsp" %>
<c:set var="title" value="Story ${item.extId}" scope="request"/>
<s:layout-render name="/layout/normal.jsp">
<s:layout-component name="bodyTitle">
</s:layout-component>
<s:layout-component name="htmlHead">
  <script type="text/javascript" src="${pageContext.request.contextPath}/js/effects.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath}/js/window.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath}/js/dragdrop.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath}/js/template.js"></script>

  <link href="${pageContext.request.contextPath}/style/window/default.css" rel="stylesheet" type="text/css" />
  <link href="${pageContext.request.contextPath}/style/window/mac_os_x.css" rel="stylesheet" type="text/css" />
  <link href="${pageContext.request.contextPath}/style/print.css" rel="stylesheet" media="print" type="text/css" />
</s:layout-component>
<s:layout-component name="body">

<span id="result_container" style="display:none"></span>

<s:url beanclass="org.xptracker.web.EffortEntryActionBean" var="effortUrl"/>
<s:url beanclass="org.xptracker.web.StoryBookmarkActionBean" var="bmkUrl"/>
<s:url beanclass="org.xptracker.web.StoryDiffActionBean" var="diffUrl"/>
<script type="text/javascript">
  function sendForm(vars) {
    var form = vars.form;
    var completionFunction = vars.onComplete;
    var destination = vars.dest == null ? 'result_container' : vars.dest;
    clearElements(destination);
    new Insertion.Bottom(destination, '<i>Updating...</i>');
    var params = Form.serialize(form);
    new Ajax.Updater(destination, form.action,
      {method:'post', postBody: params, onComplete: completionFunction, evalScripts: true});
  }

  function showEffortWindow(comment) {
    var win = new Window('effort_window',
    {className: 'mac_os_x', title: "Effort", width:800, height:600,
      hideEffect:Element.hide, showEffect:Element.show, resizable: true,
      url: "${effortUrl}?storyId=${item.id}&amp;comment=" + escape(comment)});
    win.toFront();
    win.setDestroyOnClose();
    win.setConstraint(true, {left:0, right:0});
    win.showCenter();
  }

  function showStoryDiffWindow(diffId) {
    var win = new Window('diff_window',
    {className: 'mac_os_x', title: "Diff", width:800, height:600,
      hideEffect:Element.hide, showEffect:Element.show, resizable: true,
      url: "${diffUrl}?storyId=${item.id}&amp;snapshotId=" + diffId});
    win.toFront();
    win.setDestroyOnClose();
    win.setConstraint(true, {left:0, right:0});
    win.showCenter();
    Element.hide('snapshot-list');
  }

  function addBookmark() {
    changeBookmark('Add');
  }

  function removeBookmark() {
    changeBookmark('Remove');
  }

  function changeBookmark(action) {
    $('bmk_action').name = action;
    sendForm({form: $('bmk_form'), onComplete: bookmarkChanged});
  }

  function bookmarkChanged(update) {
    Element.hide(update.responseText == 'added' ? 'add_bmk_link' : 'rmv_bmk_link');
    Element.show(update.responseText == 'removed' ? 'add_bmk_link' : 'rmv_bmk_link');
  }
</script>

<s:form beanclass="org.xptracker.web.StoryBookmarkActionBean" id="bmk_form" style="display:inline">
  <input type="hidden" id="bmk_action" name="" value="1"/>
  <input type="hidden" id="bmk_story_id" name="storyId" value="${item.id}"/>
</s:form>

<c:set var="bookmarked" value="${xp:contains(user.bookmarkedStories,item)}"/>
<div class="<xp:storyClassName story="${item}"/> ${item.size} story-title">
<h3 class="left">
  <s:url beanclass="org.xptracker.web.EffortSparkActionBean" var="sparkUrl"/>
  <img src="${sparkUrl}?storyId=${item.id}" style="vertical-align:middle;"/>

  <c:forEach items="${item.categories}" var="category">
    <xp:category-image category="${category}" size="medium" style="vertical-align:middle"/>
  </c:forEach>
  <span  style="vertical-align:middle">
  ${item.extId}: ${item.summary}
  <c:if test="${!empty item.dueDate}">
    (Due on
    <fmt:formatDate value="${item.dueDate}" pattern="MM/dd/yyyy"/>
    )
  </c:if>
  </span>
</h3>
  <ss:secure roles="editor">
    <h3 class="right noprint">
    <span id="add_bmk_link" style="${bookmarked?'display:none':''}">
    [<a href="javascript:addBookmark('${item.id}')">Bookmark Me</a>]
    </span>
    <span id="rmv_bmk_link" style="${bookmarked?'':'display:none'}">
    [<a href="javascript:removeBookmark('${item.id}')">Remove Bookmark</a>]
    </span>
    [<a href="javascript:showEffortWindow('')">Effort</a>]
      [<s:link beanclass="org.xptracker.web.StoryActionBean" event="Edit">
      <s:param name="storyId" value="${item.id}"/>
      Edit
    </s:link>]

      <c:if test="${!empty storySnapshots}">
        <span class="snapshot-menu">
          [<a href="#" onclick="$('snapshot-list').style.display='block'">Versions...</a>]
          <ul id="snapshot-list" class="snapshot-list">
            <c:forEach items="${storySnapshots}" var="snapshot">
              <li>
                <a href="#" onclick="showStoryDiffWindow(${snapshot.id})">
                  <fmt:formatDate value="${snapshot.occurred}" type="date" dateStyle="short"/>
                  <fmt:formatDate value="${snapshot.occurred}" type="time" timeStyle="short"/>
                </a>
              </li>
            </c:forEach>
          </ul>
        </span>
      </c:if>
    </h3>
  </ss:secure>
  <div style="clear:both;"> </div>
</div>
             
<div class="blog description-contents">
  <h3>Description</h3>
  <div id="description_content" style="padding:0; margin:0">
    <xp:wiki-display content="${item.descriptionContent}"/>
  </div>
</div>
<script type="text/javascript">
  var maxHeight = WindowSize.height() * 3 / 5;
  if ($('description_content').clientHeight > maxHeight) {
    $('description_content').style.maxHeight = maxHeight;
    $('description_content').style.overflowY = 'scroll';
  }
</script>

<div class="info-box status">
  <h3>Status</h3>
  <table width="100%">
    <tr>
      <td class="form-label" width="5%">Creator:</td>
      <td><xp:user-link user="${item.creator}"/></td>
      <td class="form-label">Created:</td>
      <td><fmt:formatDate value="${item.createdDate}" pattern="yyyy-MM-dd @ HH:mm"/></td>
    </tr>
    <tr>
      <td class="form-label" width="5%">Owner:</td>
      <td><xp:user-link user="${item.owner}"/></td>
      <td class="form-label">Modified:</td>
      <td><fmt:formatDate value="${item.lastModified}" pattern="yyyy-MM-dd @ HH:mm"/></td>
    </tr>
    <tr>
      <td class="form-label" width="5%">State:</td>
      <td><xp:story-state-display story="${item}"/></td>
      <td class="form-label">Severity:</td>
      <td>${item.severity}</td>
    </tr>
    <tr>
      <td class="form-label" width="5%">Estimate:</td>
      <td><xp:display-effort amount="${xp:toMillis(item.estimate, 'hours')}" stopAt="minutes"/></td>
      <td class="form-label">Size:</td>
      <td>${item.size}</td>
    </tr>
    <tr>
      <td class="form-label">Actual:</td>
      <td colspan="3"><xp:display-effort amount="${item.totalEffort}" stopAt="minutes"/> (<xp:display-effort amount="${xp:toMillis(item.hoursRemaining, 'hours')}" stopAt="hours"/> left )</td>
    </tr>
  </table>
</div>

<script type="text/javascript">
  function deleteAttachment(fileId) {
    if (confirm('Really delete this attachment?')) {
      document.deleteAttachmentForm.fileId.value = fileId;
      sendForm({form: document.deleteAttachmentForm, dest: 'attachmentList'});
    }
  }

  function reloadAttachmentList() {
    sendForm({form: document.displayAttachmentListForm, dest: 'attachmentList'});
  }

  var addAttachUrl = '<s:url beanclass="org.xptracker.web.StoryActionBean"/>?ShowAttachForm=1&storyId=${item.id}';

  var addAttachWindow = new Window('addAttach_window', {});
</script>

<div id="attachmentList" class="info-box attachments">
  <jsp:include page="attachmentList.jsp"/>
</div>

<s:form beanclass="org.xptracker.web.StoryActionBean" name="deleteAttachmentForm">
  <s:hidden name="fileId"/>
  <s:hidden name="storyId" value="${item.id}"/>
  <input type="hidden" name="DeleteAttachment" value="1"/>
</s:form>

<s:form beanclass="org.xptracker.web.StoryActionBean" name="displayAttachmentListForm">
  <s:hidden name="storyId" value="${item.id}"/>
  <input type="hidden" name="ShowAttachList" value="1"/>
</s:form>

<div class="info-box history" style="text-align:center;">
  <h3 style="text-align:left;">History</h3>
  <xp:story-chart story="${item}"/>
</div>

<div class="info-box tasks">
  <h3>
    <ss:secure roles="editor">
      <a class="action" href="javascript:showTaskWindow()">Add</a>
    </ss:secure>
    Tasks
  </h3>
  <xp:task-list story="${item}"/>
</div>

<div id="categoryList" class="info-box categories">
  <jsp:include page="categoryList.jsp"/>
</div>

<script type="text/javascript">
  function addCategory(id) {
    toggleCategory('AddCategory', id);
  }

  function removeCategory(id) {
    if (confirm('Are you sure you want to remove this category?')) {
      toggleCategory('RemoveCategory', id);
    }
  }

  function toggleCategory(action, id) {
    $('categoryAction').name = action;
    document.categoryForm.uuid.value = id;
    sendForm({form: document.categoryForm, dest: 'categoryList'});
  }
</script>
<s:form beanclass="org.xptracker.web.StoryActionBean" name="categoryForm" style="display:inline">
  <input type="hidden" name="uuid"/>
  <input type="hidden" name="storyId" value="${item.id}"/>
  <input type="hidden" id="categoryAction" value="1"/>
</s:form>

<div id="trackerList" class="info-box trackers">
  <jsp:include page="trackerList.jsp"/>
</div>

<script type="text/javascript">
  function toggleTracker(isTracker) {
    if (!isTracker || confirm("Are you sure you wish to remove yourself as tracker?")) {
      $('trackerAction').name = isTracker ? 'RemoveTracker' : 'AddTracker';
      sendForm({form: $('trackerForm'), dest: 'trackerList'});
    }
  }

  function addTracker(id) {
    var idArr = id.split('/');
    var userId = idArr[0];
    var username = idArr[1];
    if (confirm('Really add \'' + username + '\' as a tracker?')) {
      $('trackerAction').name = "AddOtherTracker";
      $('trackerUserId').value = userId;
      sendForm({form: $('trackerForm'), dest: 'trackerList'});
    }
  }
</script>

<s:form beanclass="org.xptracker.web.StoryActionBean" id="trackerForm" style="margin:0px;">
  <input type="hidden" name="storyId" value="${item.id}"/>
  <input type="hidden" id="trackerUserId" name="userId"/>
  <input id="trackerAction" type="hidden" name="not-set" value="1"/>
</s:form>

<div id="customerList" class="info-box customers">
  <jsp:include page="customerList.jsp"/>
</div>

<s:form beanclass="org.xptracker.web.StoryActionBean" name="newCustomerForm" style="display:inline">
  <input type="hidden" name="customerName"/>
  <input type="hidden" name="storyId" value="${item.id}"/>
  <input type="hidden" name="NewCustomer" value="1"/>
</s:form>

<s:form beanclass="org.xptracker.web.StoryActionBean" name="removeCustomerForm" style="display:inline">
  <input type="hidden" name="uuid"/>
  <input type="hidden" name="storyId" value="${item.id}"/>
  <input type="hidden" name="RemoveCustomer" value="1"/>
</s:form>

<s:form beanclass="org.xptracker.web.StoryActionBean" name="addCustomerForm" style="display:inline">
  <input type="hidden" name="uuid"/>
  <input type="hidden" name="storyId" value="${item.id}"/>
  <input type="hidden" name="AddCustomer" value="1"/>
</s:form>

<s:form beanclass="org.xptracker.web.StoryActionBean" name="listCustomersForm" style="display:inline">
  <input type="hidden" name="storyId" value="${item.id}"/>
  <input type="hidden" name="ListCustomers" value="1"/>
</s:form>

<script type="text/javascript">
  function addCustomer(id) {
    if (id == '[new]') {
        createNewCustomer();
    } else {
        document.addCustomerForm.uuid.value = id;
        sendForm({form: document.addCustomerForm, dest: 'customerList'});
    }
  }

  function createNewCustomer() {
    var customerName = prompt('Customer Name');
    if (customerName) {
      document.newCustomerForm.customerName.value = customerName;
      sendForm({form: document.newCustomerForm, dest: 'customerList'});
    }
  }

  function removeCustomer(id) {
    if (confirm('Are you sure you want to remove this customer?')) {
      document.removeCustomerForm.uuid.value = id;
      sendForm({form: document.removeCustomerForm, dest: 'customerList'});
    }
  }

  function listCustomers() {
    sendForm({form: document.listCustomersForm, dest: 'customerList'});
  }

</script>


<div class="blog-entries">
  <table style="border-collapse:collapse; width:100%; margin:0px; padding:0px">
    <tr>
      <td><strong>Blog</strong></td>
      <td style="text-align:right">
        <span id="showButton">[ <a href="#" onclick="showEntryForm()">Update Story...</a> ]</span>
        <span id="blogEntryPreview" style="display:none">
          [ <a href="http://daringfireball.net/projects/markdown/dingus" target="_blank">Help</a> ] [ <xp:wiki-preview id="entry"/> ] [ <a href="#" onclick="hideEntryForm()">Close</a> ]
        </span>
      </td>
    </tr>
  </table>

  <div id="blogEntry" style="display:none;padding:5px">
    <s:form beanclass="org.xptracker.web.StoryActionBean" style="margin:0px;">
      <div>
        <s:hidden name="storyId" value="${item.id}"/>
        <input id="nextState" type="hidden" name="nextState"/>
        <s:textarea id="entry" name="entry" rows="10" value="" style="width:100%"/>
      </div>
      <fieldset style="display:inline">
        <legend>Add Comments</legend>
        <s:submit id="eventButton" name="AddBlogEntry" value="Add Blog Entry"/>
        <input type="reset" value="Reset"/>
      </fieldset>
      <ss:secure roles="editor">
      <fieldset style="display:inline">
        <legend>Change State</legend>
        <xp:action-states story="${item}">
          <s:button name="Change State" value="${description}" onclick="changeState('${state}')"/>
        </xp:action-states>
      </fieldset>
      </ss:secure>
    </s:form>
  </div>
  
  <div class="blog" style="margin-top:5px;">
  <c:forEach items="${xp:reverse(item.blogEntries)}" var="entry">
      <div class="<xp:storyClassName story="${item}"/> blog-header">
        <xp:user-link user="${entry.creator}"/> |
        <fmt:formatDate value="${entry.createdDate}" pattern="yyyy-MM-dd @ HH:mm"/>
      </div>
      <div class="blog-content">
        <xp:wiki-display content="${entry.wikiContent}"/>
      </div>
  </c:forEach>
  </div>
</div>

<script type="text/javascript">
  function showEntryForm() {
    Element.show('blogEntry');
    Element.show('blogEntryPreview');
    Element.hide('showButton');
    $('entry').focus();
  }

  function hideEntryForm() {
    Element.hide('blogEntry');
    Element.hide('blogEntryPreview');
    Element.show('showButton');
  }    

  function changeState(state) {
    if (!$('entry').value) {
       $('entry').value = 'No blog entry.';
    }
    $('nextState').value = state;
    $('eventButton').name = 'AlterState';
    $('eventButton').click();
  }
</script>
<s:errors field="entry">
  <s:errors-header><script type="text/javascript">showEntryForm()</script></s:errors-header>
  <span style="display:none"><s:individual-error/></span>
  <s:errors-footer></s:errors-footer>
</s:errors>
</s:layout-component>
</s:layout-render>